<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JS复习</title>
</head>
<body>
<script>
    //定义类
    function Person() {
        this.name = "";
        this.age = 18;
        this.play = function () {
            console.info("play");
        }
        this.eat = function () {
            alert("eat");
        }
    }

    var p = new Person();

    //动态创建
    var p1 = new Object();
    p1.name = "";
    p1.age = 18;
    p1.play = function () {
        console.info("play");
    }

    //JSON方式
    var p2 = {}//空对象 var p1=new Object();
    var p3 = {
        name: "zhangsan",
        age: 18,
        play: function () {
            console.info("play");
        },
        eat: () => {
            alert("eat");
        }
    }
</script>
<button onclick="p.play()">玩</button>
<button onclick="p.eat()">吃</button>
<hr>
<button onclick="p3.play()">玩3</button>
<button onclick="p3.eat()">吃3</button>

<h2>JS回调</h2>
<input type="number">
<select>
    <option value="add">+</option>
    <option value="subtract">-</option>
    <option value="multiply">*</option>
    <option value="divide">/</option>
</select>
<input type="number">
<button onclick="clk()">=</button>
<span id="res"></span>

<script>
    function add(a, b) {
        return a + b;
    }

    function subtract(a, b) {
        return a - b;
    }

    function multiply(a, b) {
        return a * b;
    }

    function divide(a, b) {
        return a / b;
    }

    // fn函数对象==>回调函数
    function op(a, b, fn) {
        var res = fn(a, b);
        var resElement = document.getElementById("res");
        resElement.innerText = res;
    }

    function clk() {
        //获取输入框的值
        var inputs = document.querySelectorAll("input");
        var a = inputs[0].value;
        var b = inputs[1].value;

        //获取计算函数
        var select = document.querySelector("select");
        // var selectedOptions = select.selectedOptions;

        // var index = select.selectedIndex;// 0-3
        // index++;

        // var fname = "op" + index;
        eval("var fn=" + select + ";");
        a = parseInt(a);
        b = parseInt(b);
        op(a, b, fn);
    }
</script>
</body>
</html>